SVG Repo – 免費 SVG 圖標與向量圖示免費下載，高達 500,000+ 的免版權可商用圖標集任你下載

SVG Repo 是目前最大的免費 SVG 圖標資源庫，收錄超過 500,000 個開放授權的向量圖標與插圖，支援線上編輯、TinySVG 壓縮、30 多種風格分類，大部分圖標可免費商用且不需署名。

SVG Repo 是什麼？

SVG Repo（svgrepo.com）是一個開放授權的 SVG 向量圖標目錄平台，由 SVG Repo LLC 營運。截至 2026 年 5 月，平台收錄超過 500,000 個 SVG 向量圖標與插圖，並整理成 6,000+ 個按風格分類的圖標集合（Collections），涵蓋 Monocolor、Multicolor、Duotone、Outlined、Filled、Glyph、Rounded、Sharp 等 30 多種風格類型。

SVG Repo 與一般圖標網站最大的不同，在於它不僅是個下載站，而是一個「搜尋、瀏覽、編輯、再混合」的一站式工具。平台使用機器學習驅動的搜尋引擎，讓關鍵字搜尋更精準；所有圖標都經過自家的 TinySVG 壓縮技術處理，下載即最佳化；內建線上編輯器可以在不開啟設計軟體的情況下直接改顏色和尺寸。官方明確標示「Always Free, No Premium」，不會在搜尋結果中穿插付費內容。

如果你之前用過其他圖標資源，像是 Heroicons、Ionicons、Remix Icon 或 Simple Icons，那些平台各有所長，但 SVG Repo 的優勢在於圖標量大、風格選擇多、而且有完整的集合管理功能。如果你需要的不只是幾十個 UI 圖標，而是涵蓋各種主題的完整向量資源庫，SVG Repo 會是更全面的選擇。

為什麼圖標該用 SVG 而不是 PNG？

SVG 是向量格式，用數學公式描述圖形，不管放大到多大都不會失真。PNG 是點陣格式，放大後會出現鋸齒和模糊。在做響應式網頁的時候，同一個圖標可能要在大螢幕手機、平板和桌機上分別呈現不同尺寸，SVG 的無損縮放特性就非常關鍵。

檔案大小也是一個實際的差異。一個簡單的單色 SVG 圖標通常只有幾百 bytes 到 1-2 KB，同等解析度的 PNG 可能要 5-15 KB。一個頁面如果用了幾十個圖標，這個差距會直接反映在載入速度上。搭配 WordPress 快取外掛和 SVG 格式的圖標，整體效能表現會比使用 PNG 好很多。如果你還需要進一步壓縮 SVG，可以參考 SVGOMG 這個工具，通常能再減少 20-50% 的檔案大小。

比較項目	SVG 向量格式	PNG 點陣格式
縮放表現	任意縮放不失真	放大後模糊、有鋸齒
檔案大小（單色圖標）	約 0.5-2 KB	約 5-15 KB
可編輯性	文字編輯器或設計軟體皆可修改	需使用圖片編輯軟體
顏色控制	可直接用 CSS 修改	無法用 CSS 控制
動畫支援	支援 CSS/SMIL 動畫	需轉為 GIF 或 APNG
瀏覽器支援	所有主流瀏覽器	所有瀏覽器
SEO	可包含結構化文字資訊	僅能透過 alt 文字
適用場景	圖標、LOGO、插圖	照片、截圖、複雜影像

只要是圖標、LOGO 這類線條明確的圖形，SVG 幾乎都是比 PNG 更好的選擇。如果你有把圖片轉成向量的需求，可以試試 Vectorizer.AI；如果需要產生波浪等向量裝飾元素，SVG Waves 是免費的好選擇。

SVG Repo 授權方式：可以免費商用嗎？

可以，而且大部分圖標不需署名。根據 SVG Repo 官方授權頁面，平台上的圖標採用多種授權，但預設的「SVG Repo License」涵蓋了大部分內容。

SVG Repo License（預設授權）：這是平台上最常見的授權類型，涵蓋所有由 SVG Repo 或其使用者從公共領域及開源素材轉換而來的內容。你不需要署名，可以自由分享和修改，可用於商業專案，但不能將素材原封不動地轉賣，也不能用類似 SVG Repo 的方式重新發布這些素材。

除了預設授權之外，部分圖標可能採用以下授權：

授權類型	可否商用	需要署名	修改權限
SVG Repo License	可商用	不需要（但歡迎附上連結）	可自由修改
Public Domain / CC0	可商用	不需要	可自由修改
MIT License	可商用	需保留授權聲明	可自由修改
CC BY	可商用	需要署名	可修改
CC BY-SA	可商用	需要署名	衍生作品需相同授權
CC BY-NC	禁止商用	需要署名	可修改但不得商業使用

實際操作上，SVG Repo 上大多數圖標都屬於 SVG Repo License 或 CC0，直接拿來商用沒什麼問題。但保險起見，下載前還是建議看一眼該圖標頁面上標示的授權類型。如果你想比較各平台的授權機制，可以參考我們之前寫過的 Flaticon 和 Iconshock 介紹文章。

SVG Repo 操作教學：搜尋到下載的完整流程

SVG Repo 不需要註冊帳號就能直接使用。整個操作流程可以分成四個步驟：搜尋、篩選、預覽、下載。

步驟一：搜尋圖標。打開 SVG Repo 官網，在首頁搜尋框輸入英文關鍵字（例如 email、home、settings），按下 Enter 就會出現所有相關結果。如果你不確定要搜什麼，可以直接往下捲動瀏覽首頁的精選圖標集合。

步驟二：用風格分類篩選。搜尋結果頁面和首頁都有風格分類標籤，包括 Monocolor（單色）、Multicolor（彩色）、Duotone（雙色調）、Outlined（輪廓線）、Filled（填充）、Glyph、Rounded（圓角）、Sharp（銳角）等。點擊對應標籤就能快速縮小範圍。首頁的 Collection 分頁則可以瀏覽 6,000+ 個按主題和風格整理好的圖標集合。

步驟三：預覽並確認授權。點進單一圖標頁面後，你會看到圖標所屬的集合名稱、授權類型、以及下方的相似圖標推薦。如果你需要整套風格統一的圖標，建議直接進入該圖標所屬的集合頁面，從那裡一次挑選。同一集合的圖標出自同一設計師，風格一致，放到同一個專案裡不會有違和感。

步驟四：下載或線上編輯。確認圖標和授權都沒問題後，點選「Download SVG File」就能取得已壓縮的 SVG 檔案。如果你需要先改顏色或大小，點「Edit Vector」可以開啟內建編輯器，在瀏覽器裡直接修改，完成後再下載。

這些功能搭配 iconmonstr 的 CC0 圖標或 Feather Icons 的極簡風格圖標一起使用，設計專案需要的圖標素材基本上都能搞定。如果你偏好更多選擇，Tabler Icons 提供了超過 558 個 MIT 授權的高品質圖標，LineIcons 和 IconPark 也各有特色。如果你需要動態效果，Icons8 的 Animated Icons 提供了動畫版本的圖標。

如何修改 SVG 圖標？顏色、尺寸與路徑編輯

從 SVG Repo 下載的圖標可以透過兩種方式修改：一是用平台內建的線上編輯器，二是用文字編輯器直接改 SVG 原始碼。線上編輯器適合改顏色和尺寸等基本調整，文字編輯器則提供更細緻的控制。

修改顏色：用文字編輯器打開 SVG 檔案，找到 fill 屬性，把色碼替換成你需要的顏色。例如把 fill="#000000" 改成 #0066CC。如果圖標有多個 fill 屬性，需要逐一替換。你也可以在 VS Code 裡用全域搜尋與替換功能，一次改掉整個資料夾裡所有 SVG 的特定色碼。配色靈感可以從 Color Palette Generator 這類調色盤工具找到。

修改尺寸：直接改 SVG 的 width 和 height 屬性，或用 CSS 的 transform: scale() 來縮放。如果你是用內嵌方式把 SVG 放到 HTML 裡面，用 CSS 控制大小更有彈性，也不會影響原始的 viewBox 設定。

修改路徑：如果需要改變圖標的形狀（例如調整圓角、加粗線條），就需要編輯 <path> 元素的 d 屬性。直接改程式碼的難度比較高，建議用視覺化工具：免費的 Inkscape、免費基本功能的 Figma、或付費的 Adobe Illustrator。如果你只是要改顏色或大小，用文字編輯器就夠了。

如果你想自己畫簡單的 SVG 圖標但不想用專業軟體，SVG Favicon Maker 可以幫你快速產生基本 SVG 圖形。Iconpie 則可以上傳圖片後自動產生 Web、iOS、Android 各種尺寸的網站圖標。

網頁嵌入 SVG 的三種方式

下載 SVG 圖標之後，怎麼放到網頁裡面？主要有三種方式，各有適用場景。不管你用的是 Bluehost、Kinsta 還是其他 WordPress 主機，這些嵌入方式都通用。

方式一：用 <img> 標籤引入。最簡單的做法：<img src="icon.svg" alt="描述文字">。優點是程式碼乾淨、瀏覽器會自動快取外部 SVG。缺點是無法用 CSS 控制 SVG 內部樣式，也沒辦法做 CSS 動畫。適合不需要互動的靜態展示圖標。

方式二：直接內嵌 SVG 程式碼到 HTML 中。把 SVG 原始碼直接貼到 HTML 裡面，就能用 CSS 完全控制每個元素，包括顏色、大小和動畫。例如用 fill: currentColor 讓圖標自動繼承父元素的文字顏色，做 hover 效果很方便。缺點是 SVG 程式碼會讓 HTML 變長，頁面用太多內嵌 SVG 會影響原始碼可讀性。建議只對需要互動的圖標使用內嵌方式。

方式三：用 CSS 的 background-image。適合純裝飾性圖標：background-image: url('icon.svg')。完全不佔用 HTML 結構，但無法用 CSS 控制 SVG 內部樣式，對 SEO 也沒有幫助。

比較項目	<img> 標籤	內嵌 SVG	CSS background
CSS 控制樣式	無法控制內部	完全控制	無法控制內部
CSS 動畫	不支援	支援	不支援
SEO	透過 alt 文字	可包含文字內容	無 SEO 價值
HTML 體積	小	可能較大	小
瀏覽器快取	可快取	隨 HTML 載入	可快取
適用場景	靜態展示	需要互動或動畫	純裝飾元素

WordPress 使用者要注意：WordPress 預設不允許上傳 SVG 檔案（安全性考量）。解決方法是安裝 Safe SVG 等外掛，或者直接在編輯器裡貼 SVG 程式碼。如果你還沒有自己的 WordPress 網站，可以參考我們的 Bluehost WordPress 安裝教學，或看看 SiteGround 和 Hostinger 的主機方案。

SVG Repo 與五大免費圖標庫比較

市面上免費圖標資源不少，幫你快速判斷哪個平台最適合你的需求。以下是 SVG Repo 與 Flaticon、Icons8、Remix Icon、iconmonstr 的橫向比較。

比較維度	SVG Repo	Flaticon	Icons8	Remix Icon	iconmonstr
圖標總數	500,000+	7,000,000+	230,000+	2,000+	4,496+
授權彈性	多種開放授權，預設不需署名	需署名（免費版）	需署名（免費版）	MIT 完全免費	CC0 完全免費
搜尋精準度	機器學習驅動	標準搜尋	AI 搜尋	分類瀏覽	標準搜尋
下載格式	SVG	PNG/SVG/EPS	PNG/SVG/ICNS	SVG/Font	PNG/SVG/EPS/PSD
圖標集合管理	6,000+ 集合	有集合功能	有集合功能	統一風格整套	無集合
壓縮技術	TinySVG 壓縮	無	無	無	無
API	有免費 API	付費版	有	無	無
線上編輯	有內建編輯器	有	有	無	無
付費內容	無，不穿插付費內容	有付費方案	有付費方案	完全免費	完全免費

怎麼選？如果你是網頁前端開發者，需要大量不同風格的 SVG 圖標而且在乎檔案大小，SVG Repo 是最實際的選擇，所有圖標都經過 TinySVG 壓縮，有 6,000+ 個集合可以保持風格統一，而且不穿插付費內容。如果你的專案是開源軟體或需要極簡線條風格，Remix Icon 的 2,000+ 個 MIT 授權圖標就夠用。設計師可能更喜歡 Flaticon 或 Icons8，因為它們提供更多格式和線上編輯器。做簡報或文件的話，iconmonstr 的 CC0 授權最省心。

其他值得參考的圖標資源：Heroicons 介面簡潔好上手，Unicons Solid 有超過 3,300 個圖標涵蓋 27 種類別，Emblemicons 主打產品開發和業務展示的圖標，Octicons 是 GitHub 官方出品。Radix Icons 的 15×15 像素設計則適合緊湊的介面佈局。FindIcons 作為全球最大的圖示搜尋引擎，也是值得認識的資源。

SVG Repo API 與開發者工具

對前端開發者來說，手動下載圖標一個個放到專案裡效率不高。SVG Repo 提供免費的 REST API（Icon API），讓你用程式化的方式搜尋和取得圖標資料。你可以寫腳本根據關鍵字批量下載 SVG，然後轉換成 React 或 Vue Component，直接放進元件庫。

除了 API，SVG Repo 還提供幾個實用工具：vectormaker（向量圖製作）、Font Repo（字體資源庫）、SVG Find（SVG 搜尋工具）。這些工具對需要將圖標管理整合到自動化流程中的開發團隊來說很實用。API 有呼叫頻率限制，大量使用前建議先查閱官方文件。如果你的網站架在高效能的 WordPress 主機上，像是 A2 Hosting 或 Kinsta，搭配 API 自動化同步圖標可以讓管理更輕鬆。對 WordPress 外掛生態有興趣的話，可以看看我們整理的 WordPress SEO 外掛推薦。

SVG Repo 的限制與不適合的場景

SVG Repo 雖然資源豐富，但並非萬能。以下是幾個需要注意的限制：

只提供 SVG 格式。如果你需要 PNG、EPS 或 PSD 等格式，SVG Repo 沒辦法直接提供。你需要自行用設計軟體匯出，或改用 Flaticon、Icons8 等支援多格式的平台。

圖標風格品質參差不齊。500,000+ 個圖標來自不同設計師和來源，雖然有集合分類可以幫忙篩選，但同一個搜尋結果裡還是可能出現風格差異很大的圖標。需要花時間挑選和確認風格一致性。

無法一鍵下載整個集合。SVG Repo 目前沒有提供批量下載整個圖標集合的功能，你需要逐一點擊下載，或透過 API 用程式批量取得。

部分圖標授權需個別確認。雖然預設的 SVG Repo License 涵蓋大部分內容，但仍有少部分圖標採用 CC BY-NC 等禁止商用的授權。商業專案使用前務必逐一確認。

不適合需要品牌 Logo 的場景。平台上雖然有品牌相關圖標，但這些屬於「Logo License」分類，使用時需要遵守各品牌自己的規範，不能隨意修改或用於非預期用途。如果你需要品牌 SVG 圖標，Simple Icons 是更專門的選擇。

三個下一步：馬上開始用 SVG Repo

1. 到官網搜尋你需要的圖標。打開 SVG Repo，輸入關鍵字試試搜尋效果。先從你目前的專案需要的圖標開始找，確認搜尋精準度和風格是否符合你的需求。

2. 找到喜歡的圖標後，進入它所屬的集合頁面。從同一個集合挑選整套圖標，可以確保風格統一。下載前確認授權類型是 SVG Repo License 或 CC0 就能放心商用。

3. 下載後用文字編輯器或設計軟體微調。改顏色只需替換 fill 色碼，改大小直接改 width/height 屬性。如果你用的是 WordPress，記得安裝 Safe SVG 外掛才能上傳 SVG 檔案。如果不知道選哪個主機，參考我們的 WordPress 主機推薦懶人包。

SVG Repo 常見問題 FAQ

SVG Repo 的圖標可以免費商用嗎？

大部分可以。平台上多數圖標採用 SVG Repo License（預設授權）或 Public Domain / CC0，都不需要署名，可用於商業專案。少部分圖標採用 CC BY-NC 授權，這類圖標就不能商用。建議在每個圖標的下載頁面確認授權標示。

使用 SVG Repo 的圖標需要署名嗎？

SVG Repo License 和 CC0 授權的圖標都不需要署名。MIT License 技術上需要保留授權聲明，但實務上通常只需保留 SVG 檔案內的 metadata。CC BY 和 CC BY-SA 授權的圖標則需要標注原作者資訊。

SVG Repo 有提供 API 嗎？

有的。SVG Repo 提供免費的 Icon API，開發者可以搜尋圖標、取得集合資訊、下載 SVG 原始資料。適合需要將圖標管理整合到自動化流程或設計系統的團隊。API 有呼叫頻率限制，大量使用前建議查閱官方文件。

如何一次下載整個圖標集？

SVG Repo 目前沒有一鍵下載整個集合的功能。你可以透過 API 批量取得圖標資料，或進入集合頁面後逐一點擊下載。如果集合數量不多，手動下載也不會花太多時間。

SVG 圖標在 WordPress 裡面怎麼使用？

WordPress 預設不允許上傳 SVG 檔案。你可以安裝 Safe SVG 等外掛啟用 SVG 上傳，或直接在編輯器裡貼 SVG 程式碼。如果你的網站架在 Bluehost 等支援 WordPress 的主機上，這些方法都能正常運作。想找免費測試環境的話，可以參考 CloudAccess 免費 WordPress 主機。

下載的 SVG 檔案還能進一步壓縮嗎？

SVG Repo 的圖標已經過 TinySVG 壓縮處理，檔案通常已經很小。如果你還需要更小的體積，可以用 SVGOMG 這個免費線上工具，通常能再減少 20-50%。也可以自己安裝 SVGO 命令列工具，用腳本批量處理。如果你的圖片素材也需要壓縮，Compress PNG/JPG 線上壓縮工具可以同時處理 PNG 和 JPG 格式。

SVG Repo 的圖標可以在 Figma 或 Illustrator 裡面編輯嗎？

可以。SVG 是通用向量格式，下載的 SVG 檔案可以直接在 Figma、Adobe Illustrator、Inkscape、Sketch 等工具中開啟和編輯。如果你使用的是 Adobe Photoshop Express 等線上工具，同樣支援 SVG 格式匯入。

SVG 圖標會影響網站載入速度嗎？

不會，反而通常比 PNG 圖標更快。SVG 檔案體積小（一個簡單圖標通常不到 2 KB），而且可以透過 CSS 和 JS 直接在瀏覽器中渲染，不需要額外的圖片解碼過程。加上 SVG Repo 的 TinySVG 壓縮，檔案更小。如果你的網站使用大量圖標，建議把常用的 SVG 整合成 sprite sheet 或使用內嵌方式，可以減少 HTTP 請求次數。

如果你手上有圖片素材需要做基本編輯處理，ImageMatting 是一個免費的 AI 去背工具，搭配 SVG 圖標的網頁嵌入技巧一起使用，可以讓整體設計工作流程更順暢。想找更多設計靈感的話，Illustration Kit 提供的專業向量素材也值得一逛，而 Icons8 免費圖庫和 FreeImages 都是品質不錯的免費圖片資源。如果你需要更大型的向量插圖素材，Free Vector Illustrations 和 Loose Drawing 提供了免費的向量插圖，可以跟圖標搭配使用。Iconhub 和 Iconstore 也有提供一些適合 APP 介面的圖標風格，可以跟 SVG Repo 的資源互相搭配。